Local Navigation: A Valuable Orientation and Wayfinding Aid本地導航

使用紙質地圖探索陌生城市時,人們通常採用兩種導航方式:一是確定目的地位置並尋找最佳路徑;二是隨意探索周邊區域,發現咖啡店或公園等有趣地點。

一幅展現倫敦大規模地理特徵和街區的全球視角地圖,對於尋找附近的咖啡店毫無用處,但對於決定如何從大英博物館前往白金漢宮則很有幫助。
倫敦布里克斯頓社群的當地景象顯示出更多樣化的特色。在這裡,很容易找到附近的吃飯地方,但對於找到去白金漢宮的路卻沒有幫助。

本地導航的定義和功能 (Definition and Functions of Local Navigation)

定義:本地導航是相對於使用者當前頁面的上下文導航。它顯示同級頁面(同一分類下的其他頁面),以及當前頁面的子級頁面,幫助使用者在資訊架構(IA)中定位和探索內容。

功能:

  1. 定位作用: 明確當前頁面所在的分類層級,類似地圖上的“你在這裡”標記。
  1. 路徑指引: 提供同一分類下其他頁面的連結,便於使用者進一步探索。
  1. 降低互動成本: 提供對深層次資訊架構內容的快捷訪問,避免頻繁返回高層選單。
一個網站資訊架構的樹形圖:全域性導航是層次結構的頂層(產品、行業、服務和支援),無論使用者在網站的何處,它都保持不變。本地導航與使用者的當前位置相關——它顯示當前頁面和同級頁面;在這種情況下,人力資源和人員是當前頁面,供應鏈管理、客戶關係管理和客戶體驗以及網路管理都是包含在本地導航中的同級頁面。
SAP 使用全域性和本地導航。兩個導航欄的位置(全域性導航在本地導航之上)表明了它們的相對範圍。

本地導航的適用場景 (When to Use Local Navigation)

日產網站為每種車型提供了本地導航,使使用者能夠在詳細的功能、相簿配件和規格頁面之間快速跳轉。對於像汽車這樣的重大購買決策,使用者很可能在該部分的頁面之間反覆切換。

適合本地導航的情況:

  1. 使用者傾向於瀏覽同一分類下的多個頁面: 如電商網站的商品比較、大學網站的專業瀏覽等。
  1. 使用者需要整合或比較多個頁面的資訊: 如對比產品規格、檢視多項服務內容等。
  1. 使用者從內頁進入網站: 需要透過本地導航保持方位感和探索效率。

不適合本地導航的情況:

本地導航的設計要點 (Designing Effective Local Navigation)

1. 位置的選擇 (Placement of Local Navigation)

常見佈局:

案例:

波特蘭大學有一個非常深入的資訊架構,導致頁面左側的本地導航縮排很深。由於空間不足,第六層(環境工程輔修)的縮排程度幾乎與第五層(土木工程)相同。(請注意,該網站導航的前兩層在本地導航中不可見:學術>學院與學校>唐納德·P·希利工程學院>學位與課程>土木工程>環境工程輔修是可見頁面的位置。另外,請注意,在這種情況下,由於多叉樹結構,導航路徑與可見的麵包屑路徑不同)

2. 顯示的深度 (Depth of Visibility)

案例:Prudential 網站在第三級層級顯示完整本地導航,進入第四級時切換為麵包屑,保持導航簡潔而不失功能性。

3. 顯著性設計 (Visibility Without Overemphasis)

4. 互動成本低 (Minimizing Interaction Cost)

羅德島設計學院的網站為每個學位課程設定了粘性本地導航,使使用者能夠輕鬆在概述、師資、課程列表和其他頁面之間跳轉。這種設計是對持久本地導航的明智使用,因為潛在學生在一個會話期間通常會深入探究特定學位課程的細節。